<template>


    <div class="post" style="margin-bottom: 260px">
        <div class="post-block">
            <span class="title">{{ projectinfo.projectinfoname }}</span>
            <span class="description">

    
                            </span>


        </div>

        <el-row :gutter="20">
            <el-col :span="12">
                <div style="text-align: center;margin-top: 10px" v-if="projectinfo.image!=null">

                    <img
                        :src="BASE_API+projectinfo.image"
                        style="text-align: center;width:80%;height:80%;in-height: 260px;max-height: 260px"/>
                </div>

            </el-col>
            <el-col :span="12" style="padding-top: 30px">


                <div class="text1"> 发布日期：{{ projectinfo.createdate }}</div>





            </el-col>
        </el-row>
        <el-tabs v-model="activeName" style="margin-top: 30px">


            <div class="text" v-html="projectinfo.remark" style="min-height: 500px"></div>


        </el-tabs>


    </div>


</template>

<script name="projectinfoDetail" setup>

import {onMounted, ref, watch} from "vue";

const postFormRef = ref(null) // 如果页面有表单,则使用此ref
const route = useRoute();   //获取路由中的信息或参数
const router = useRouter();   //操作路由,跳转之类的
import {ElMessage, ElMessageBox} from "element-plus";  //提示框和消息


import axios_request from '../util/axios_request.js'
import {useRoute, useRouter} from "vue-router";


const projectinfo = ref({});//这里写注释
const BASE_API = ref('http://localhost:8081/');


const activeName = ref('first')//当前的tab


//添加表单

const postForm = ref({});

const rules = ref({});


onMounted(() => {

    getList()


})


watch(() => route, newdata => {
    // 如果路由参数有变化，会再次执行获取列表数据
    getList()

}, {deep: true})

function getList() {
    //获取分类
    if (route.query.id > 0) {
        //  console.log("content"+route.query.id)

        // 详情页

        axios_request.get('/web/projectinfoDetail.action?id=' + route.query.id).then(response => {
            projectinfo.value = response.data
        })


    }
}


</script>


<style rel="stylesheet/scss" lang="scss" scoped>


.post {
    font-size: 14px;

    color: #666;

    .image {
        width: 80%;
        height: 100%;

    }


    .text1 {
        text-indent: 25px;
        font-size: 16px;
        line-height: 45px;
    }

    .text {
        text-indent: 25px;
        font-size: 16px;
        line-height: 35px;
    }
}

.post-block {
    text-align: center;
    padding-bottom: 15px;

    .description {
        display: block;

        padding: 2px 0;
    }

    .title {
        font-size: 30px;
        color: #000;
        text-align: center;
        font-weight: bold;
    }


}
</style>
